<%@ page language="java" import="java.util.*" contentType="text/html; charset=UTF-8" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
String path = request.getContextPath();
request.setCharacterEncoding("UTF-8");
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
String htmlData = request.getParameter("content1") != null ? request.getParameter("content1") : "";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'newproduct.jsp' starting page</title>
    <meta charset="utf-8" />
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	
	<link rel="stylesheet" href="<%=basePath%>themes/default/default.css" />
	<link rel="stylesheet" href="<%=basePath%>plugins/code/prettify.css" />
	<script charset="utf-8" src="<%=basePath%>kindeditor.js"></script>
	<script charset="utf-8" src="<%=basePath%>kindeditor-min.js"></script>
	<script charset="utf-8" src="<%=basePath%>lang/zh_CN.js"></script>
	<script charset="utf-8" src="<%=basePath%>plugins/code/prettify.js"></script>
  	<script>
  				function fontsizechange(e){
  						if(isNaN($("#productsize").val())||$("#productsize").val()==""||$("#productsize").val()==null){
  						}else{
  						   
  							var size=parseInt($("#productsize").val());
  							
  							if(e==38){
  							   size = size+1;
  							}else if(e==40){
  							   size = size-1;
  							}else if(size<0){
  							  size=0;
  							}
  							if(size>200){
  								alert("字体大小最大不超过200");
  								$("#productsize").val(0);
  								$("#previewfont").css("font-size","0px");
  								
  							}else{
  							     $("#productsize").val(size);
  								$("#previewfont").css("font-size",size+"px");
  							}
  						}
  				}
  				$().ready(function(){
  				   $("#productsize").keydown(function(e){
  				   var code = e.which;
  				    fontsizechange(code)
  				   });
  				   fontsizechange(null);
  				   change();
  				});
  				function updateProduct(){
  					var newName=$("#productName").val();
  					var content=editor1.html();
  					var productsize=$("#productsize").val();
  					var alias = $("#alias").val();
  					var productId = $("#productId").val();
  					$.post("updateProduct",{"productSize":productsize,"content":content,"alias":alias,"productId":productId,"productName":newName},function(data){
  							if(data.msg=="success"){
  								alert("修改成功");
  							}else if(data.msg=="fail"){
  								alert("修改失败");
  							}
  					});
  				}
  				function checkproductName(){
  					var newName=$("#productName").val();
  					if(newName==""||newName==null){
  						alert("产品名不能为空");
  						$("#productName").focus();
  					}else{
  						if(isNaN($("#productsize").val())||$("#productsize").val()==""||$("#productsize").val()==null){
  									alert("请输入正确的字号");
  									$("#productsize").val("");
  									$("#productsize").focus();
  									return null;
  								}else{
  									updateProduct();
  								}
  				}
  				}
  				var editor1;
  				KindEditor.ready(function(K) {
			 editor1 = K.create('textarea[name="content1"]', {
				cssPath : '<%=basePath%>plugins/code/prettify.css',
				uploadJson : '<%=basePath%>BackstageManagement/upload_json.jsp',
				fileManagerJson : '<%=basePath%>BackstageManagement/file_manager_json.jsp',
				allowFileManager : true,
				afterCreate : function() {
					var self = this;
					K.ctrl(document, 13, function() {
						self.sync();
						document.forms['example'].submit();
					});
					K.ctrl(self.edit.doc, 13, function() {
						self.sync();
						document.forms['example'].submit();
					});
				}
			});
			prettyPrint();
		});
     function change(){
    
       var labelId = $("#labelId").val();
      var labelName = $("#name"+labelId).val();
      var alias = $("#alias"+labelId).val();
      var html = "款式编号：<font color=red> "+labelId+"</font>&nbsp;&nbsp;<br>款式名：<input type=text id=lname"+labelId+" value="+labelName
           +" /><br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;款式别名：<input type=text value="
           +alias+" id=a"+labelId
           +" ><input type=button value=修改  onclick=update("+labelId+") >";
      $("#display").html(html);
     
     
     }
     function update(id){
       var alias = $("#a"+id).val();
       var name = $("#lname"+id).val();
      $.post("updateLabelById",{"alias":alias,"labelId":id,"labelName":name},
      function(data){
         if(data.msg=="success"){
         alert("修改成功！");
         $("#alias"+id).val(alias);
         $("#name"+id).val(name);
         $("#o"+id).html(name);
         }
      });
     }
  	</script>
  	<style type="text/css">
  	.labelClass{}
  	</style>
  </head>
  
  <body STYLE="TEXT-ALIGN:CENTER">
  <%=htmlData%>
  <table>
	  <tr>
		  <td rowspan="2">
		   <div style="width:700px;margin-top:0px;line-height: 30px;float: left;">
    		<div align="left" style="margin-left: 30px;">
   					&nbsp;&nbsp;&nbsp;<font size="5">产品信息</font><br/>
   					产品编号：<font color="red">${product.productId }</font><br/>
   					<input type="hidden" id="productId" value="${product.productId }" />
   					<label>产&nbsp;&nbsp;&nbsp;品&nbsp;&nbsp;&nbsp;名:</label>
   					<input type="text" name="productName" id="productName" value="${product.productName }"><br/>
   					<label>字&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;号:</label>
   					<input type="text" name="productsize" id="productsize" value="${product.productSize }" onkeyup="fontsizechange(-1)">(按“↑”、“↓”可调节字号大小)<br/>
   					别&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名:
   					<input type="text" value="${product.alias }" name="alias" id="alias"/>(若有多个别名请用空格隔开)<br/>
   					产品描述:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
   					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
   					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
   					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
   					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
   					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
   					<input type="button" onclick="checkproductName()" value="修改">&nbsp;&nbsp;
   					<input type="button" value="返回" onclick="javascript:history.back(-1)">
   					<form name="example" method="post" action="newproduct.jsp">
   					<textarea name="content1" id="editor_id" cols="100" rows="8" style="width:700px;height:400px;visibility:hidden;">${product.productDesc}<%=htmlspecialchars(htmlData)%></textarea>
		<br />
		</form>
   					
   			</div><br/><br/>
   			<!-- <div align="center" style="font-size: 0px;height:230px; padding-top:30px;background-color: red;clear:both;" > -->
   				
   			<!-- </div> -->
   	</div>
    
		  </td>
		  <td valign="middle" style="height: 251px;width: 300px;">
		  <div align="right">
                <table align="center"  style="line-height:normal;margin-left: 30px; margin-top: -30px;" >
   			 		<tr valign="top">
   							<td ><font id="previewfont" style="font-size: 0px;">大</font></td>
   					</tr>
   				</table>
         </div>
		  </td>
	  </tr>
	  <tr>
		  <td valign="top" height="400px">
			  <div>
			  <c:if test="${labels!='[]'}">
			  款式修改：
	                  <select id="labelId" onchange="change()">
	                   <c:forEach items="${labels}" var="label">
	                    <option value="${label.labelId}" id="o${label.labelId }">${label.labelName}</option>
	                   </c:forEach> 
	                  </select>
	                  <div style="display:none;">
	                   <c:forEach items="${labels}" var="label">
	                   
	                    <div id="div${label.labelId }">
	                       <input type="hidden" value="${label.labelName }" id="name${label.labelId }"/>
	                       <input type="hidden" value="${label.labelId }" id="id${label.labelId }"/>
	                       <input type="hidden" value="${label.alias }" id="alias${label.labelId }"/>    
	                    </div>
	                    
	                   </c:forEach> 
	                   </div>
	                   <div id="display" style="line-height: 25px; margin-top: 15px;">
	                   
	                   </div>
	          </c:if>
	          <c:if test="${labels=='[]'}">
	                 暂无款式
	          </c:if>
	          </div>
		  </td>
	  </tr>
	  
  </table>
 
  
    
  </body>
</html>
<%!
private String htmlspecialchars(String str) {
	str = str.replaceAll("&", "&amp;");
	str = str.replaceAll("<", "&lt;");
	str = str.replaceAll(">", "&gt;");
	str = str.replaceAll("\"", "&quot;");
	return str;
}
%>
